@(resource: Resource)(implicit request: RequestHeader)
@import helper._
@import utils.RequestHelper

@uid() = @{request.session.get("uid").getOrElse("-1").toInt}
@main(s"${resource.title} - ${app.Global.siteSetting.name}", "community", resource.resType, resource.keywords, resource.title) {
<link rel="stylesheet" href="/assets/plugins/quill/quill.snow.css">
<link rel="stylesheet" href="/assets/plugins/quill/quill-emoji.css">
<link rel="stylesheet" href="/assets/plugins/highlight/styles/monokai-sublime.css">
<style>
/* Set default font-family */
#quill-container {
  font-family: "Helvetica Neue", Helvetica, "PingFang SC", 微软雅黑, "STHeiti Light", Tahoma, Arial, sans-serif;
  height: 200px;
}
.layui-upload-file, .layui-upload-button { display: none;}

.ql-editor {
  padding: 0px 15px;
  color: #3d464d;
  white-space: normal;
}
.ql-editor p, .ql-editor ol, .ql-editor ul {
  line-height: 28px;
}
.ql-editor p, .ql-editor ol, .ql-editor ul, .ql-editor pre, .ql-editor blockquote, .ql-editor h1, .ql-editor h2, .ql-editor h3, .ql-editor h4, .ql-editor h5, .ql-editor h6 {
    margin: 5px 0px 5px;
    padding: 10px 0px 5px;
}
.ql-editor h1, .ql-editor h2, .ql-editor h3, .ql-editor h4, .ql-editor h5, .ql-editor h6 {
    margin-top: 15px;
}

.ql-editor ul li, .ql-editor ul li {
  padding: 0px;
  border: 0px;
}
</style>
@nav(resource.resType)
<div class="layui-container">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md12 content detail">
      <div class="fly-panel detail-box">
        <h1>@resource.title</h1>
        <div class="fly-detail-info">
          <!-- <span class="layui-badge">审核中</span> -->
          <span class="layui-badge layui-bg-green fly-detail-column">分享</span>

          @if(!resource.closed){
          <span class="layui-badge" style="background-color: #999;">未结</span>
          }else{
           <span class="layui-badge" style="background-color: #5FB878;">已结</span>
          }

          @if(resource.top){
          <span class="layui-badge layui-bg-black">置顶</span>
          }
          @if(resource.recommended){
          <span class="layui-badge layui-bg-red">精帖</span>
          }

          <div class="fly-admin-box" data-id="@resource._id" data-type="@resource.resType">
            @if(RequestHelper.isAdmin || RequestHelper.isOwnerOf(resource._id)){
            <span class="layui-btn layui-btn-xs jie-admin" type="del">删除</span>
            }
            @if(RequestHelper.isAdmin){
            @if(!resource.top){
            <span class="layui-btn layui-btn-xs jie-admin" type="set" field="stick" rank="true">置顶</span>
            }else{
            <span class="layui-btn layui-btn-xs jie-admin" type="set" field="stick" rank="false" style="background-color:#ccc;">取消置顶</span>
            }
            @if(!resource.recommended){
            <span class="layui-btn layui-btn-xs jie-admin" type="set" field="recommended" rank="true">加精</span>
            }else{
            <span class="layui-btn layui-btn-xs jie-admin" type="set" field="recommended" rank="false" style="background-color:#ccc;">取消加精</span>
            }
            }
            @if(RequestHelper.isOwnerOf(resource._id)){
            @if(!resource.closed){
            <span class="layui-btn layui-btn-xs jie-admin" type="set" field="closed" rank="true">关贴</span>
            }else{
            <span class="layui-btn layui-btn-xs jie-admin" type="set" field="closed" rank="false" style="background-color:#ccc;">开贴</span>
            }
            }
          </div>
          <span class="fly-list-nums">
            <i class="layui-icon" title="收藏">&#xe600;</i> <em id="collect-count">@resource.collectStat.count</em>
            <i class="iconfont icon-zan" title="点赞"></i> <em id="vote-count">@resource.voteStat.count</em>
            <a href="#comment"><i class="iconfont" title="回答">&#xe60c;</i> @resource.replyStat.replies.size</a>
            <i class="iconfont" title="人气">&#xe60b;</i> @resource.viewStat.count
          </span>
        </div>
        <div class="detail-about">
          <a class="fly-avatar" href="/user/home?uid=@{resource.author._id}">
            <img src="@resource.author.headImg" alt="">
          </a>
          <div class="fly-detail-user">
            <a href="/user/home?uid=@{resource.author._id}" class="fly-link">
              <cite>@resource.author.name</cite>
              <!--<i class="iconfont icon-renzheng" title="认证信息：{{ rows.user.approve }}"></i>
              <i class="layui-badge fly-badge-vip">VIP3</i>-->
            </a>
            <span>@utils.DateTimeUtil.toPrettyString(resource.createTime)发布</span>
          </div>
          <div class="detail-hits" id="LAY_jieAdmin" data-id="@resource._id">
            <!--<span style="padding-right: 10px; color: #FF7200">悬赏：60飞吻</span>-->
            @if(resource.author._id == request.session.get("uid").getOrElse("")){
            <span class="layui-btn layui-btn-xs jie-admin" type="edit"><a href="/@{resource.resType}/edit?_id=@{resource._id}">编辑此贴</a></span>
            }
            @if(RequestHelper.isLogin && utils.BitmapUtil.fromBase64String(resource.collectStat.bitmap).contains(request.session.get("uid").getOrElse("-1").toInt)){
            <span class="layui-btn layui-btn-xs jie-admin  layui-btn-danger" type="collect" data-type="remove" data-resource="resource">取消收藏</span>
            }else{
            <span class="layui-btn layui-btn-xs jie-admin " type="collect" data-type="add" data-resource="resource">收藏</span>
            }
            @if(RequestHelper.isLogin && utils.BitmapUtil.fromBase64String(resource.voteStat.bitmap).contains(RequestHelper.getUid.toInt)){
            <span class="layui-btn layui-btn-xs zan-resource layui-btn-danger" data-zan="1" data-id="@resource._id"  data-type="resource" data-title="@resource.title">取消点赞</span>
            }else{
            <span class="layui-btn layui-btn-xs zan-resource" data-zan="0" data-id="@resource._id"  data-type="resource" data-title="@resource.title">点赞</span>
            }
          </div>
        </div>
        <div class="detail-body photos ql-snow" style="margin-bottom: 20px;">
          <div class="ql-editor"> @Html(resource.content) </div>
        </div>
      </div>

      <div class="fly-panel detail-box" id="flyReply">
        <fieldset class="layui-elem-field layui-field-title" style="text-align: center;">
          <legend>回帖</legend>
        </fieldset>

        <ul class="jieda" id="jieda">
          @for(r <- resource.replyStat.replies){
          @defining(utils.BitmapUtil.fromBase64String(r.voteStat.bitmap)){ bitmap =>
          <li data-id="@{resource._id}" data-uid="@{r.author._id}" data-rid="@{r._id}" data-type="resource" data-title="@{resource.title} 中 @{r.author.name} 的回复" class="jieda-daan">
            <a name="item-@{r._id}"></a>
            <div class="detail-about detail-about-reply">
              <a class="fly-avatar" href="/user/home?uid=@{r.author._id}">
                <img src="@{r.author.headImg}" alt=" ">
              </a>
              <div class="fly-detail-user">
                <a href="/user/home?uid=@{r.author._id}" class="fly-link">
                  <cite>@{r.author.name}</cite>
                  <!--<i class="iconfont icon-renzheng" title="认证信息：XXX"></i>
                  <i class="layui-badge fly-badge-vip">VIP3</i>-->
                </a>

                <!--<span>(楼主)</span>-->
                <!--
                <span style="color:#5FB878">(管理员)</span>
                <span style="color:#FF9E3F">（社区之光）</span>
                <span style="color:#999">（该号已被封）</span>
                -->
              </div>

              <div class="detail-hits">
                <span>@utils.DateTimeUtil.toPrettyString(r.createTime)</span>
              </div>

              <!--<i class="iconfont icon-caina" title="最佳答案"></i>-->
            </div>
            <div class="detail-body jieda-body photos ql-snow">
              <div class="ql-editor"> @Html(r.content) </div>
            </div>
            <div class="jieda-reply">
              <span class="jieda-zan @if(bitmap.contains(uid)){zanok}" type="zan">
                <i class="iconfont icon-zan"></i>
                <em>@{r.voteStat.count}</em>
              </span>
              <span type="reply">
                <i class="iconfont icon-svgmoban53"></i>
                回复
              </span>
              @if(RequestHelper.isOwnerOf(r._id)){
              <div class="jieda-admin">
                <!--<span type="edit">编辑</span>-->
                <span type="del">删除</span>
                <!-- <span class="jieda-accept" type="accept">采纳</span> -->
              </div>
              }
            </div>
          </li>
          }
          }

          @if(resource.replyStat.replies.isEmpty){
          <li class="fly-none">消灭零回复</li>
          }
        </ul>
        @if(RequestHelper.isLogin && !resource.closed){
        <div id="quill-container"></div>
        <div class="layui-form layui-form-pane" style="margin-top: 15px;">
          <form id="form" action="/resource/reply" method="post">
            <div class="layui-form-item">
              <input type="hidden" name="resId" value="@resource._id">
              <input type="hidden" name="resType" value="@resource.resType">
              <input type="hidden" name="resTitle" value="@resource.title">
              <input id="L_content" type="hidden" name="content"/>
              <input id="at-input" type="hidden" name="at" value="">
              <input type="file" name="file" id="LAY-upload-image" data-token="" class="layui-upload-file">
              <button class="layui-btn" lay-submit>提交回答</button>
            </div>
          </form>
        </div>
        }
      </div>
    </div>
  </div>
</div>
}
<script type="text/javascript" src="/assets/plugins/quill/quill.min.js"></script>
<script type="text/javascript" src="/assets/plugins/quill/quill-emoji.js"></script>
<script src="/assets/plugins/highlight/highlight.pack.js"></script>
<script>
layui.cache.page = 'resource';

@if(RequestHelper.isLogin && !resource.closed){
var quill = new Quill('#quill-container', {
  theme: 'snow',
  modules: {
    toolbar: {
      container : [
        [{ 'size': [] }],
        [ 'bold', 'italic', 'underline' ],
        [ 'blockquote', 'code-block' ],
        [{ 'list': 'ordered' }, { 'list': 'bullet'}],
        [{ 'align': [] }],
        [ 'link', 'image' ],
        ['emoji'],
        [ 'clean' ]
      ],
      handlers: {
        image: function(){ $('#LAY-upload-image').click(); },
        'emoji': function () {}
      }
    },
    "emoji-toolbar": true,
    "emoji-shortname": true,
    "emoji-textarea": false
  }
});

$('#form').submit(function(){
  $('#L_content').val(quill.root.innerHTML);
});

layui.use('upload', function(upload){
  var upload = layui.upload;
  upload.render({
    elem: '#LAY-upload-image'
    ,method: 'post'
    ,url: '/resource/owner/editor'
    ,done: function(res){
      var range = quill.getSelection(true);
      var Delta = Quill.import('delta');
      quill.updateContents(
        new Delta().retain(range.index)
           .delete(range.length)
           .insert({ image: res.url })
        , 'user');
    }
    ,error: function(){
      layer.msg('error');
    }
  });
});

}

$(document).ready(function() {
  $('pre').each(function(i, block) {
    //$(block).removeClass('ql-syntax').addClass('scala');
    $(block).addClass('scala');
    hljs.highlightBlock(block);
  });
});
</script>
